<template>
     <div class="col-xl-12 ">
                <div class="card">
                  <div class="card-header pb-0">
                    <h5>Pagination sizing</h5>
                  </div>
                  <div class="card-body">
                    <!-- large size pagination-->
                    <nav class="m-b-30" aria-label="Page navigation example">
                      <ul class="pagination pagination-lg pagination-primary">
                        <li class="page-item"><a class="page-link" href="javascript:void(0)">Previous</a></li>
                        <li class="page-item"><a class="page-link" href="javascript:void(0)">1</a></li>
                        <li class="page-item"><a class="page-link" href="javascript:void(0)">2</a></li>
                        <li class="page-item"><a class="page-link" href="javascript:void(0)">3</a></li>
                        <li class="page-item"><a class="page-link" href="javascript:void(0)">Next</a></li>
                      </ul>
                    </nav>
                    <!-- small size pagination-->
                    <nav aria-label="Page navigation example">
                      <ul class="pagination pagination-sm pagination-primary">
                        <li class="page-item"><a class="page-link" href="javascript:void(0)">Previous</a></li>
                        <li class="page-item"><a class="page-link" href="javascript:void(0)">1</a></li>
                        <li class="page-item"><a class="page-link" href="javascript:void(0)">2</a></li>
                        <li class="page-item"><a class="page-link" href="javascript:void(0)">3</a></li>
                        <li class="page-item"><a class="page-link" href="javascript:void(0)">Next</a></li>
                      </ul>
                    </nav>
                  </div>
                </div>
              </div>
</template>